<script setup lang="ts">
import { ref } from 'vue';

const props = defineProps({
  total: {
    type: Number,
    default: 0,
  },
  current: {
    type: Number,
    default: 1,
  },
  pageSize: {
    type: Number,
    default: 10,
  },
});
const emits = defineEmits(['change']);
const current = ref(props.current);
const pageSize = ref(props.pageSize);
const change = (e: any, size: any) => {
  emits('change', e, size);
};
</script>
<template>
  <div class="page-box">
    <a-pagination v-model:current="current" v-model:page-size="pageSize" show-size-changer :total="props.total"
      @change="change" />
  </div>
</template>
<style lang="less" scoped>
.page-box {
  margin-top: 20px;
  display: flex;
  justify-content: flex-end;
}
</style>
